﻿<phone:PhoneApplicationPage 
    x:Class="RemoteControl.Views.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:cal="clr-namespace:Caliburn.Micro;assembly=Caliburn.Micro"  
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="696"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    shell:SystemTray.IsVisible="True"
    xmlns:local="clr-namespace:VirtualKeyboard.Controls;assembly=VirtualKeyboard.Controls"
    xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
    Style="{StaticResource TransitionPageStyle}">
    <phone:PhoneApplicationPage.Resources>
        <BitmapImage x:Key="ff" UriSource="/RemoteControl;component/Icons/appbar.transport.ff.rest.png" />
        <BitmapImage x:Key="soundUp" UriSource="/RemoteControl;component/Icons/sound.up.png" />
        <BitmapImage x:Key="soundDown" UriSource="/RemoteControl;component/Icons/sound.down.png" />
        <BitmapImage x:Key="soundOff" UriSource="/RemoteControl;component/Icons/sound.off.png" />
        <BitmapImage x:Key="stop" UriSource="/RemoteControl;component/Icons/transport.stop.png" />
        <BitmapImage x:Key="play" UriSource="/RemoteControl;component/Icons/transport.playorpause.png" />
        <BitmapImage x:Key="fullscreen" UriSource="/RemoteControl;component/Icons/transport.fullscreen.png" />
        <BitmapImage x:Key="raw" UriSource="/RemoteControl;component/Icons/appbar.transport.rew.rest.png" />

    </phone:PhoneApplicationPage.Resources>
    <!--LayoutRoot 是包含所有页面内容的根网格-->
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <!--TitlePanel 包含应用程序的名称和页标题-->
        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
            <TextBlock x:Name="ApplicationTitle" Text="{Binding Path=AppName, Source={StaticResource LocalizedStrings}}" Style="{StaticResource PhoneTextNormalStyle}"/>
        </StackPanel>

        <!--ContentPanel - 在此处放置其他内容-->
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <Grid.Resources>
                <Style x:Key="smallButton" TargetType="local:RoundButton">
                    <Setter Property="Height" Value="90" />
                    <Setter Property="Width" Value="90" />
                    <Setter Property="HorizontalAlignment" Value="Center" />
                    <Setter Property="VerticalAlignment" Value="Center" />
                </Style>
            </Grid.Resources>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="100*" />
                <ColumnDefinition Width="160" />
                <ColumnDefinition Width="100*" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="350"/>
                <RowDefinition Height="90"/>
                <RowDefinition Height="100" />
                <RowDefinition Height="100" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <local:LoopControl Name="loopControl1" 
                               VerticalAlignment="Center" Grid.ColumnSpan="3" HorizontalAlignment="Center" Grid.Column="0" 
                               Width="340" Height="340">
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="CenterClick">
                        <cal:ActionMessage MethodName="OnLoopControlCenterClick" />
                    </i:EventTrigger>
                    <i:EventTrigger EventName="LoopGlide">
                        <cal:ActionMessage MethodName="OnLoopControlLoopGlide" >
                            <cal:Parameter Value="$eventArgs" />
                        </cal:ActionMessage>
                    </i:EventTrigger>
                </i:Interaction.Triggers>
            </local:LoopControl>
            <local:RoundButton Content="Button" Grid.Column="1" Grid.ColumnSpan="1" Grid.Row="1" Height="140" Name="roundButton1" 
                               Width="140" Grid.RowSpan="2" Style="{StaticResource smallButton}" ImageSource="{StaticResource play}" Command="{Binding TogglePlayPauseCommand}" />
            <local:RoundButton Content="Button" Style="{StaticResource smallButton}" Grid.Row="2" ImageSource="{StaticResource fullscreen}" Command="{Binding FullScreenCommand}" />
            <local:RoundButton Content="Button" Style="{StaticResource smallButton}" Grid.Row="1" ImageSource="{StaticResource raw}" Command="{Binding PreviousTrackCommand}" />
            <local:RoundButton Content="Button" Style="{StaticResource smallButton}" Grid.Row="3" Grid.Column="2" ImageSource="{StaticResource soundDown}" Command="{Binding DecreaseVolumeCommand}" />
            <local:RoundButton Content="Button" Style="{StaticResource smallButton}" Grid.Row="3"  ImageSource="{StaticResource soundOff}" Command="{Binding MuteVolumeCommand}"/>
            <local:RoundButton Content="Button" Style="{StaticResource smallButton}" Grid.Row="1" Grid.Column="2" ImageSource="{StaticResource ff}" Command="{Binding NextTrackCommand}" />
            <local:RoundButton Content="Button" Style="{StaticResource smallButton}" Grid.Row="2" Grid.Column="2" ImageSource="{StaticResource soundUp}" Command="{Binding IncreaseVolumeCommand}" />
            <local:RoundButton Content="Button" Style="{StaticResource smallButton}" Grid.Row="3" Grid.Column="1" ImageSource="{StaticResource stop}"  Command="{Binding StopCommand}"/>

        </Grid>
    </Grid>

    <!--演示 ApplicationBar 用法的示例代码-->
    <phone:PhoneApplicationPage.ApplicationBar >
        <shell:ApplicationBar Mode="Minimized" IsVisible="True" IsMenuEnabled="True"
                               BackgroundColor="#00FFFFFF" StateChanged="OnAppBarStateChanged" Opacity="1">
            <shell:ApplicationBar.MenuItems>
                <!--<cal:AppBarMenuItem Message="GoToConfig" Text="配置" />
                <cal:AppBarMenuItem Message="GoToAbout" Text="帮助"/>-->
            </shell:ApplicationBar.MenuItems>
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>

</phone:PhoneApplicationPage>